<#include "../head.html"/>
	<div class="layui-layout layui-layout-admin">
		<div class="layui-header">
			<div class="layui-logo">管理中心</div>
			<!-- 头部区域（可配合layui已有的水平导航） -->
			<ul class="layui-nav layui-layout-left">
				<li class="layui-nav-item"><a href="">控制台</a></li>
				<li class="layui-nav-item"><a href="">商品管理</a></li>
				<li class="layui-nav-item"><a href="">用户</a></li>
				<li class="layui-nav-item"><a href="javascript:;">其它系统</a>
					<dl class="layui-nav-child">
						<dd>
							<a href="">邮件管理</a>
						</dd>
						<dd>
							<a href="">消息管理</a>
						</dd>
						<dd>
							<a href="">授权管理</a>
						</dd>
					</dl></li>
			</ul>
			<ul class="layui-nav layui-layout-right">
				<li class="layui-nav-item"><a href="javascript:;"> <img
						src="http://t.cn/RCzsdCq" class="layui-nav-img"> 贤心
				</a>
					<dl class="layui-nav-child">
						<dd>
							<a href="">基本资料</a>
						</dd>
						<dd>
							<a href="">安全设置</a>
						</dd>
					</dl></li>
				<li class="layui-nav-item"><a href="">退了</a></li>
			</ul>
		</div>

		<#include "../left.html"/>

		<div class="layui-body">
			<!-- 内容主体区域 -->
			<div style="padding: 15px;">
			<table class="layui-hide" id="userTable" lay-filter="userTable"></table>
 
			<script type="text/html" id="toolbarDemo">
  				<div class="layui-btn-container">
    				<button class="layui-btn layui-btn-sm" lay-event="addData">添加</button>
  				</div>
			</script>
			 
			<script type="text/html" id="barDemo">
  				<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
  				<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
			</script>
			
			
			</div>
		</div>

		<#include "../footer.html"/>
	</div>
	<script src="/statics/layui/layui.js"></script>
	<script>
	layui.use('table', function(){
	  var table = layui.table;
	  
	  table.render({
	    elem: '#userTable'
	    ,url:'/user/list.jhtml'
	    ,toolbar: '#toolbarDemo'
	    ,title: '用户数据表'
	    ,cols: [[
	      {type: 'checkbox', fixed: 'left'}
	      ,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true}
	      ,{field:'name', title:'用户名', width:120}
	      ,{field:'title', title: '角色', width: 200
	          ,templet: function(d){
	        	  var roleGroup=d.roleGroup;
	        	  var txt=roleGroup.name;
	        	  
	              return txt;
	            }
	          }
	      ,{fixed: 'right',title:'操作' ,width: 165, align:'center', toolbar: '#barDemo'}
	    ]]
	    ,page: true
	  });
	  
	  //头工具栏事件
	  table.on('toolbar(userTable)', function(obj){
	    var checkStatus = table.checkStatus(obj.config.id);
	    switch(obj.event){
	      case 'addData':
	        add();
	      break;
	      case 'getCheckLength':
	        var data = checkStatus.data;
	        layer.msg('选中了：'+ data.length + ' 个');
	      break;
	      case 'isAll':
	        layer.msg(checkStatus.isAll ? '全选': '未全选');
	      break;
	    };
	  });
	  
	  //监听行工具事件
	  table.on('tool(userTable)', function(obj){
	    var data = obj.data;
	    //console.log(obj)
	    if(obj.event === 'del'){
	      layer.confirm('真的删除行么', function(index){
	        //obj.del();
	        del(obj.data.id);
	        //layer.close(index);
	      });
	    } else if(obj.event === 'edit'){
	      /*layer.prompt({
	        formType: 2
	        ,value: data.email
	      }, function(value, index){
	        obj.update({
	          email: value
	        });
	        layer.close(index);
	      });*/
	    	edit(obj.data.id);
	    }else if(obj.event === 'set'){
	    	set(obj.data.id);
	    }
	  });
	});
	function edit(id) {
    	layer.open({
    		  type: 2, 
    		  area: ['500px', '450px'],
    		  content: '/user/edit.jhtml?id='+id //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
    	
    		}); 
    }
	function add() {
    	layer.open({
    		title:"添加用户",
    		  type: 2, 
    		  area: ['500px', '450px'],
    		  content: '/user/add.jhtml' //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
    	
    		}); 
    }
	
	function set(id){
		layer.open({
			title:"权限设置",
  		  type: 2, 
  		  area: ['70%', '80%'],
  		  content: '/user/set.jhtml?id='+id //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
  	
  		});
	}
	
	
	function del(id){
		$.ajax({
			type:"post",
			url : "/user/doDeleteUser",
			data : {id:id},
			dataType:"json",
			success : function(data) {
				if(data.state==0){
					layer.alert(
							data.message,
							{
								icon: 1,    // icon
								yes:function(){
									location.reload();
								}
								
							}
					);
				}else{
					alert(data.message)					
				}
			}
		});
	}
	</script>
</body>
</html>